import { BasicColumn } from "/@/components/Table"
import { FormSchema } from "/@/components/Table"
import { h } from "vue"
import { Tag } from "ant-design-vue"

export const columns: BasicColumn[] = [
  {
    title: "部门名称",
    dataIndex: "deptName",
    width: 160,
    align: "left",
  },
  {
    title: "排序",
    dataIndex: "orderNo",
    width: 50,
  },
  {
    title: "状态",
    dataIndex: "status",
    width: 80,
    customRender: ({ record }) => {
      const status = record.status
      const enable = ~~status === 0
      const color = enable ? "green" : "red"
      const text = enable ? "启用" : "停用"
      return h(Tag, { color: color }, () => text)
    },
  },
  {
    title: "创建时间",
    dataIndex: "createdAt",
    width: 180,
  },
  {
    title: "备注",
    dataIndex: "remark",
  },
]

export const searchFormSchema: FormSchema[] = [
  {
    field: "deptName",
    label: "部门名称",
    component: "Input",
    colProps: { span: 8 },
  },
  {
    field: "status",
    label: "状态",
    component: "Select",
    componentProps: {
      options: [
        { label: "启用", value: "0" },
        { label: "停用", value: "1" },
      ],
    },
    colProps: { span: 8 },
  },
]

export const formSchema: FormSchema[] = [
  {
    field: "deptName",
    label: "部门名称",
    component: "Input",
    required: true,
  },
  {
    field: "parentDept",
    label: "上级部门",
    component: "TreeSelect",

    componentProps: {
      fieldNames: {
        title: "deptName",
        key: "id",
        value: "id",
      },
      getPopupContainer: () => document.body,
    },
    required: true,
  },
  {
    field: "orderNo",
    label: "排序",
    component: "InputNumber",
    required: true,
  },
  {
    field: "status",
    label: "状态",
    component: "RadioButtonGroup",
    defaultValue: "0",
    componentProps: {
      options: [
        { label: "启用", value: "0" },
        { label: "停用", value: "1" },
      ],
    },
    required: true,
  },
  {
    label: "备注",
    field: "remark",
    component: "InputTextArea",
  },
]
